<template>
  <div class="sub-main-w2rap-view">
    <!-- 只能有一个modal，不然会重叠 -->
    <!-- 加一层类名让地图可以操作 -->
    <div class="fix-operate-map">
      <el-dialog v-model="dialogFormVisible" custom-class="detail-progress-modal" :modal="false"
                 :draggable="true" title="计划申报表" @close="closeModal">
        <div class="detail-progress-modal-info">
          <div class="progress-table">
            <div class="progress-table-header">
              <span>“标准地”整备计划申报表</span>
            </div>
            <div class="progress-table-body">
              <commonTable :state="state" @data="pushData" :isInsert="isInsert"/>
            </div>
          </div>
        </div>
        <template #footer>
          <div class="marcker-footer">
            <div class="footer-btn">
              <el-button type="primary" @click="closeModal">取消</el-button>
              <el-button type="success" @click="confirmModal">确定</el-button>
            </div>
          </div>
        </template>
      </el-dialog>
    </div>
  </div>
</template>

<script lang="ts">
import commonTable from '@/components/commonTable/index.vue'
import {ref, defineComponent, getCurrentInstance} from 'vue'
import {ElNotification} from "element-plus";

export default defineComponent({
  components: {commonTable},
  emits: ["close"],
  setup(props, context) {
    const userType = localStorage.getItem("userType")
    const loginName = localStorage.getItem("loginName");
    //获取当前时间
    const getCurrentTime = () => {
      let date = new Date();
      //年
      let year = date.getFullYear().toString();
      //月份是从0月开始获取的，所以要+1;
      let month = ''
      if ((date.getMonth() + 1) < 10) {
        month = '0' + (date.getMonth() + 1).toString()
      } else {
        month = (date.getMonth() + 1).toString()
      }
      //日
      let day = date.getDate().toString();
      //时
      let hour = date.getHours().toString();


      return year + '年' + month + '月' + day + '日' + hour +'时'
    }
    const reload = (data) => {
      if (data.geom === "") {
        appContext.config.globalProperties.axios({
          url: 'api/insert/declare',
          method: 'post',
          data:data,
          transformRequest: [function (data) {
            let oMyForm = new FormData();
            oMyForm.append("bz", data.name);
            oMyForm.append("landLoc", data.location);
            oMyForm.append("landArea", data.area);
            oMyForm.append("town", data.town);
            oMyForm.append("landType", data.use);//用途
            oMyForm.append("methods", data.methods);//供地方式
            oMyForm.append("landClass", data.type);//类型
            oMyForm.append("reportTime", data.reportTime);
            oMyForm.append("planTime", data.planTime);
            oMyForm.append("testTime", data.testTime);
            oMyForm.append("userType", userType);
            oMyForm.append("content", loginName +"于"+getCurrentTime()+"，创建了"+data.name+"地块");
            oMyForm.append("infoDate", getCurrentTime());
            return oMyForm;
          }]
        }).then(() => {
          ElNotification({
            title: '创建无kmz数据地块',
            message: "创建成功",
            type: 'success',
            position: 'top-left',
            offset: 300,
          })
          dialogFormVisible.value = false
        })
      } else {
        appContext.config.globalProperties.axios({
          url: 'api/insertGeom/declare',
          method: 'post',
          data:data,
          transformRequest: [function (data) {
            let oMyForm = new FormData();
            oMyForm.append("bz", data.name);
            oMyForm.append("geom", data.geom);
            oMyForm.append("landLoc", data.location);
            oMyForm.append("landArea", data.area);
            oMyForm.append("town", data.town);
            oMyForm.append("methods", data.methods);//供地方式
            oMyForm.append("landType", data.use);//用途
            oMyForm.append("landClass", data.type);//类型
            oMyForm.append("reportTime", data.reportTime);
            oMyForm.append("planTime", data.planTime);
            oMyForm.append("testTime", data.testTime);
            oMyForm.append("userType", userType);
            oMyForm.append("content", loginName +"于"+getCurrentTime()+"，创建了"+data.name+"地块");
            oMyForm.append("infoDate", getCurrentTime());
            return oMyForm;
          }]
        }).then(() => {
          isInsert.value = !isInsert.value
          ElNotification({
            title: '创建有kmz数据地块',
            message: "创建成功",
            type: 'success',
            position: 'top-left',
            offset: 300,
          })
          dialogFormVisible.value = false
        }).catch(() => {
          ElNotification({
            title: '创建有kmz地块',
            message: "创建失败，未导入地块数据",
            type: 'warning',
            position: 'top-left',
            offset: 300,
          })
        })
      }
    }
    const {appContext} = getCurrentInstance();
    const dialogFormVisible = ref(true)
    const state = ref(false)
    const isInsert = ref(false)
    const pushData = (data) => {
      let numReg = /^[0-9]*$/
      let numRe = new RegExp(numReg)
      if (!(numRe.test(data.area) || /^(\d)+\.(\d)+$/.test(data.area)) || data.area === '') {
        ElNotification({
          message: "土地面积不是数字，请重新录入",
          type: 'warning',
          position: 'top-left',
          offset: 300,
        })
      } else if(data.name === '' || data.location ===''  || data.town === '' || data.type === ''
          || data.methods === '' || data.use === '' || data.reportTime === ''
          || data.planTime === '' || data.testTime===''){
        ElNotification({
          message: "内容未填写完整，请继续填写",
          type: 'warning',
          position: 'top-left',
          offset: 300,
        })
      }else{
        reload(data)
      }
    }
    const confirmModal = () => {
      state.value = !state.value
    }


    const closeModal = () => {
      dialogFormVisible.value = false
      context.emit("close")
    }
    return {
      dialogFormVisible,
      state,
      confirmModal,
      closeModal,
      pushData,
      isInsert,
      reload
    }
  }
})

</script>


<style scoped lang="scss">

</style>
